﻿<div class="carrier-profile-page page-center">

    <div data-bind="with: carrier">
        <div class="carrier-data">
            <img class="carrier-picture" data-bind="attr: { src: ImageSrc }" />
            <h3 class="carrier-name" data-bind="text: Name"></h3>
            <h3 class="carrier-rank" data-bind="text: Rank"></h3>

        </div>

        <div class="carrier-info">
            <ul class="list" data-bind="foreach: { data: CarrierInfoEntries, as: 'info' }">
                <li class="info">
                    <span class="carrier-name" data-bind="css: info.Checked"></span>
                    <span class="carrier-rank" data-bind="text: info.Name"></span>
                </li>
            </ul>
        </div>

        <div class="carrier-note">   
            <span data-bind="text: Note"></span>
        </div>
    </div>

    <button class="ask-button btn" data-bind="click: AskCarrier">Ask</button>
</div>
